<template>
  <div>
    <p>我是{{ name }},今年{{ age }}岁,我的爱好是：{{ hobby }}</p>
    <p>我住在:{{ address }}</p>
    <button @click="change">changeVal</button>
    <hr />
    <GrandSon></GrandSon>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import GrandSon from './11-grandson.vue'

const props = defineProps({
  name: String,
  age: Number,
  hobby: {
    type: Array,
    default: () => {
      return ['动漫', '阅读']
    }
  },
  address: {
    type: Object,
    required: true,
    default: () => {
      return { province: '广西', city: '桂林' }
    }
  }
})

//子传父
const emit = defineEmits(['myevent'])
const change = () => {
  emit('myevent', ['动漫', '阅读'])
}
</script>

<style scoped></style>
